@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

body { width:100%;height:100%;position:absolute;margin:0;font-family: 'Lato', Calibri, Arial, sans-serif;}

.moad_main {
	width:15%;
	height:100%;
	float:left;
	background-color: #f6f6f6;
	position: fixed;
}
#contenido {
    width: 85%;
    float: right;
    height: 100%;
}
ul.m_ppal,
ul.m_ppal li,
ul.m_ppal ul {
 list-style: none;
 margin: 0;
 padding: 0;
}

ul.m_ppal {
	z-index: 597;
    position: relative;
    list-style: none outside none;
    width: 100%;
    font-weight: bold;
    margin: 0;
    padding: 0;
}

ul.m_ppal li {
 float: left;
 min-height: 1px;
 line-height: 1.3em;
 vertical-align: middle;
		-webkit-transition: all 0.3s ease-out;
    	-moz-transition: all 0.3s ease-out;
    	-ms-transition: all 0.3s ease-out;
    	-o-transition: all 0.3s ease-out;
    	transition: all 0.3s ease-out;
}

ul.m_ppal li.hover,
ul.m_ppal li:hover {
 position: relative;
 z-index: 599;
 cursor: defaul;
 border-left:5px solid rgb(180, 225, 166);
 padding-left:7px;
}

ul.m_ppal ul {
	visibility: hidden;
	position: absolute;
	z-index: 598;
	width: 150px;
	margin-top: 0px;
	width: 150px;
	top: 1px;
	left: 99%;
	position: absolute;
	display: none;
}

ul.m_ppal ul {
 float: none;
}

ul.m_ppal ul ul {
 top: 1px;
 left: 99%;
}

ul.m_ppal li:hover ul {
	visibility: visible;
	display:block;
}

ul.m_ppal a {
 display: block;
 padding: 7px 10px;
}

ul.m_ppal li {
 padding: 0;
 border: none;
}

ul.m_ppal li a {
 border-style: solid;
 border-width: 1px 0;
 border-color: #fff #d9d9d9 #d9d9d9;
}
ul.m_ppal li#config a:before {
	font-family: "FontAwesome";
	font-size:18px;
	content:'\f013'' ';
}
ul.m_ppal li#ot a:before {
	font-family: "FontAwesome";
	font-size:18px;
	content:'\f0ae'' ';
}
ul.m_ppal li#consult a:before {
	font-family: "FontAwesome";
	font-size:18px;
	content:'\f0ae'' ';
}
		ul.m_ppal li#consult ul li#users a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f007'' ';
		}


		ul.m_ppal li#consult ul li#sectores a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f03c'' ';
		}


		ul.m_ppal li#consult ul li#empresas a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f0f7'' ';
		}


		ul.m_ppal li#consult ul li#clientes a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f0c0'' ';
		}


		ul.m_ppal li#consult ul li#sorteos a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f091'' ';
		}


		ul.m_ppal li#consult ul li#premios a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f087'' ';
		}


		ul.m_ppal li#consult ul li#barrios a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f0ac'' ';
		}


		ul.m_ppal li#consult ul li#bonos a:before {
			font-family: "FontAwesome";
			font-size:18px;
			content:'\f145'' ';
		}
		

ul.m_ppal li#report a:before {
	font-family: "FontAwesome";
	font-size:18px;
	content:'\f080'' ';
}

	ul.m_ppal li {
	 padding: 7px 10px;
	 border-style: solid;
	 border-width: 1px 1px 1px 0;
	 border-color: #fff #d9d9d9 #d9d9d9;
	 background-color: #f6f6f6;
	 color: #000;
	}

	ul.m_ppal li.hover,
	ul.m_ppal li:hover,
	ul.m_ppal li {
	 background-color: #eee;
	 color: #000;
	}

	ul.m_ppal a:link,
	ul.m_ppal a:visited	{ color: #000; text-decoration: none; }
	ul.m_ppal a:hover		{ color: #000; }
	ul.m_ppal a:active	{ color: #ffa500; }

	/* -- level mark -- */

		ul.m_ppal ul {
		 font-weight: normal;
		}

ul.m_ppal li {
    padding: 0;
    border: medium none;
    background-color: rgb(246, 246, 246);
    color: rgb(0, 0, 0);
    float: none;
}

#h_ppal {
	float: left;
	width: 100%;
	margin:0;
	background-color: rgb(180,225,166);
}

#h_ppal ul.nativ {
	float: right;
	list-style:none;
	display:block;
	margin:0;
}

#h_ppal ul.nativ li {
	display:inline-block;
    margin: 5px;
	float:left;
}

#h_ppal ul.nativ li.user {
    padding: 7px 10px;
	color: rgba(0,0,0,.5);
	font-weight:bold;
    border-left: 2px solid rgba(0,0,0,.5);
    border-right: 2px solid rgba(0,0,0,.5);
}
#h_ppal ul.nativ li.off {
	width: 30px;
	height: 30px;
}
#h_ppal ul.nativ li.off a{
	display:block;
	width: 30px;
	height: 30px;
	font-size: 31px;
	text-align: center;
	color: rgba(0,0,0,.5);
		-webkit-transition: all 0.5s ease-out;
    	-moz-transition: all 0.5s ease-out;
    	-ms-transition: all 0.5s ease-out;
    	-o-transition: all 0.5s ease-out;
    	transition: all 0.5s ease-out;
}
#h_ppal ul.nativ li.off a:hover{
	color: rgb(0,0,0);
	transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-ms-transform:rotate(180deg);
	-o-transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
}

ul.m_ppal a:hover {
	color: rgb(180, 225, 166);
}

#n_user {
    display: none;
    position: absolute;
    z-index: 999;
    width: 320px;
    background: none repeat scroll 0% 0% red;
    top: 50%;
    margin-top: -123px;
    height: 246px;
    left: 50%;
    margin-left: -160px;
}

button, .button {
	border: none;
	padding: 0.6em 1.2em;
	background: rgb(90,112,83);
	color: #fff;
	font-family: 'Lato', Calibri, Arial, sans-serif;
	font-size: 1em;
	letter-spacing: 1px;
	text-transform: uppercase;
	cursor: pointer;
	display: inline-block;
	margin: 3px 2px;
	border-radius: 2px;
}

button:hover {
	background: rgb(180,225,166);
	color: rgba(0,0,0,.5);
	font-weight:bold;
}

/**,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}*/

::selection {
    background: transparent; 
}

::-moz-selection {
    background: transparent; 
}

::-webkit-selection {
    background: transparent; 
}

/* DEMO 3 */

.main_user, .main_SC, .main_novedad, .main_contactos, .main_sorteo, .main_otc, .ins_merc, .pl_tarja, .new_otno, .fotos, .remercar {
    /* Size and position */
    position: relative;
    width: 40px;
    padding: 10px;
	float:left;

    /* Styles */
    border-radius: 7px;
    cursor: pointer;

    /* Font settings */
    font-weight: bold;
    color: rgba(0,0,0,.5);
	
		-webkit-transition: all 0.5s ease-out;
    	-moz-transition: all 0.5s ease-out;
    	-ms-transition: all 0.5s ease-out;
    	-o-transition: all 0.5s ease-out;
    	transition: all 0.5s ease-out;

}

.main_user:hover, .main_SC:hover, .main_novedad:hover, .main_contactos:hover, .main_sorteo:hover, .main_otc:hover, .ins_merc:hover, .pl_tarja:hover, .new_otno:hover, .fotos:hover, .remercar:hover, .fotos:hover {
    color: #000;
}

.main_user .dropdown, .main_SC .dropdown, .main_novedad .dropdown, .main_contactos .dropdown, .main_sorteo .dropdown, .main_otc .dropdown, .ins_merc .dropdown, .pl_tarja .dropdown, .new_otno .dropdown, .fotos .dropdown, .remercar .dropdown, .fotos .dropdown {
  /* Size & position */
    position: absolute;
    top: 120%;
    left: 0;
    right: 0;
	width: 200px;
	z-index:1000;

    /* Styles */
    background: white;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: normal;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;

    /* Hiding */
    opacity: 0;
    pointer-events: none;
}

.main_user .dropdown:after, .main_SC .dropdown:after, .main_novedad .dropdown:after, .main_contactos .dropdown:after, .main_sorteo .dropdown:after, .main_otc .dropdown:after, .ins_merc .dropdown:after, .pl_tarja .dropdown:after, .new_otno .dropdown:after, .fotos .dropdown:after, .remercar .dropdown:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 12px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #fff transparent;    
}

.main_user .dropdown:before, .main_SC .dropdown:before, .main_novedad .dropdown:before, .main_contactos .dropdown:before, .main_sorteo .dropdown:before, .main_otc .dropdown:before, .ins_merc .dropdown:before, .pl_tarja .dropdown:before, .new_otno .dropdown:before, .fotos .dropdown:before, .remercar .dropdown:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 10px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.main_user .dropdown li a, .main_SC .dropdown li a, .main_novedad .dropdown li a, .main_contactos .dropdown li a, .main_sorteo .dropdown li a, .main_otc .dropdown li a, .ins_merc .dropdown li a, .pl_tarja .dropdown li a, .new_otno .dropdown li a, .fotos .dropdown:before, .remercar .dropdown:before {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: #8aa8bd;
    border-bottom: 1px solid #e6e8ea;
    box-shadow: inset 0 1px 0 rgba(255,255,255,1);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.main_user .dropdown li i,.main_SC .dropdown li i,.main_novedad .dropdown li i,.main_contactos .dropdown li i,.main_sorteo .dropdown li i,.main_otc .dropdown li i,.ins_merc .dropdown li i,.pl_tarja .dropdown li i,.new_otno .dropdown li i,.fotos .dropdown li i,.remercar .dropdown li i {
    float: right;
    color: inherit;
}

.main_user .dropdown li:first-of-type a,.main_SC .dropdown li:first-of-type a,.main_novedad .dropdown li:first-of-type a,.main_contactos .dropdown li:first-of-type a,.main_sorteo .dropdown li:first-of-type a,.main_otc .dropdown li:first-of-type a,.ins_merc .dropdown li:first-of-type a,.pl_tarja .dropdown li:first-of-type a,.new_otno .dropdown li:first-of-type a,.fotos .dropdown li:first-of-type a,.remercar .dropdown li:first-of-type a {
    border-radius: 7px 7px 0 0;
}

.main_user .dropdown li:last-of-type a,.main_SC .dropdown li:last-of-type a,.main_novedad .dropdown li:last-of-type a,.main_contactos .dropdown li:last-of-type a,.main_sorteo .dropdown li:last-of-type a,.main_otc .dropdown li:last-of-type a,.ins_merc .dropdown li:last-of-type a,.pl_tarja .dropdown li:last-of-type a,.new_otno .dropdown li:last-of-type a,.fotos .dropdown li:last-of-type a,.remercar .dropdown li:last-of-type a {
    border: none;
    border-radius: 0 0 7px 7px;
}

/* Hover state */

.main_user .dropdown li:hover a, .main_SC .dropdown li:hover a, .main_novedad .dropdown li:hover a, .main_contactos .dropdown li:hover a, .main_sorteo .dropdown li:hover a, .main_otc .dropdown li:hover a, .ins_merc .dropdown li:hover a, .pl_tarja .dropdown li:hover a, .new_otno .dropdown li:hover a, .fotos .dropdown li:hover a, .remercar .dropdown li:hover a {
    background: #f3f8f8;
}

/* Active state */

.main_user.active .dropdown, .main_SC.active .dropdown, .main_novedad.active .dropdown, .main_contactos.active .dropdown, .main_sorteo.active .dropdown, .main_otc.active .dropdown, .ins_merc.active .dropdown, .pl_tarja.active .dropdown, .new_otno.active .dropdown, .fotos.active .dropdown, .remercar.active .dropdown {
    opacity: 1;
    pointer-events: auto;
}

/* No CSS3 support */

.no-opacity       .main_user .dropdown,
.no-pointerevents .main_user .dropdown,
.no-opacity       .main_SC .dropdown,
.no-pointerevents .main_SC .dropdown,
.no-opacity       .main_novedad .dropdown,
.no-pointerevents .main_novedad .dropdown,
.no-opacity       .main_contactos .dropdown,
.no-pointerevents .main_contactos .dropdown,
.no-opacity       .main_sorteo .dropdown,
.no-pointerevents .main_sorteo .dropdown,
.no-opacity       .main_otc .dropdown,
.no-pointerevents .main_otc .dropdown,
.no-opacity       .ins_merc .dropdown,
.no-pointerevents .ins_merc .dropdown,
.no-opacity       .pl_tarja .dropdown,
.no-pointerevents .pl_tarja .dropdown,
.no-opacity       .new_otno .dropdown,
.no-pointerevents .new_otno .dropdown,
.no-opacity       .fotos .dropdown,
.no-pointerevents .fotos .dropdown,
.no-opacity       .remercar .dropdown,
.no-pointerevents .remercar .dropdown {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .main_user.active .dropdown,
.no-pointerevents .main_user.active .dropdown,
.no-opacity       .main_SC.active .dropdown,
.no-pointerevents .main_SC.active .dropdown,
.no-opacity       .main_novedad.active .dropdown,
.no-pointerevents .main_novedad.active .dropdown,
.no-opacity       .main_contactos.active .dropdown,
.no-pointerevents .main_contactos.active .dropdown,
.no-opacity       .main_sorteo.active .dropdown,
.no-pointerevents .main_sorteo.active .dropdown,
.no-opacity       .main_otc.active .dropdown,
.no-pointerevents .main_otc.active .dropdown,
.no-opacity       .ins_merc.active .dropdown,
.no-pointerevents .ins_merc.active .dropdown,
.no-opacity       .pl_tarja.active .dropdown,
.no-pointerevents .pl_tarja.active .dropdown,
.no-opacity       .new_otno.active .dropdown,
.no-pointerevents .new_otno.active .dropdown,
.no-opacity       .fotos.active .dropdown,
.no-pointerevents .fotos.active .dropdown,
.no-opacity       .remercar.active .dropdown,
.no-pointerevents .remercar.active .dropdown {
    display: block;
}

    .tooltip {
        display: none;
        position: absolute;
        padding: 10px;
        margin: 0 0 0 0;    
        z-index: 100;
        background: #000;
        color: #fff;
        text-align: center;
        font-weight: bold;
        font-size: 12px;
	    border-radius: 5px;
		text-transform:uppercase;
		font-family: 'Lato', Calibri, Arial, sans-serif;

    }
    .tooltip2 {
        display: none;
        position: absolute;
        padding: 10px;
        margin: 0 0 0 0;    
        z-index: 100;
        background: #000;
        color: #fff;
        text-align: center;
        font-weight: bold;
        font-size: 12px;
	    border-radius: 5px;
		text-transform:uppercase;
		font-family: 'Lato', Calibri, Arial, sans-serif;

    }
	
	span.ticket a {
		width: 100%;
		display: block;
		text-align: center;
		font-size: 140px;
		color: #000;
		text-decoration: none;
		-webkit-transition: all 0.5s ease-out;
    	-moz-transition: all 0.5s ease-out;
    	-ms-transition: all 0.5s ease-out;
    	-o-transition: all 0.5s ease-out;
    	transition: all 0.5s ease-out;

	}
	
	span.ticket a:hover {
		color: rgb(17, 237, 255);
		transform:scale(1.2) rotate(90deg);
		-moz-transform:scale(1.2) rotate(90deg);
		-ms-transform:scale(1.2) rotate(90deg);
		-o-transform:scale(1.2) rotate(90deg);
		-webkit-transform:scale(1.2) rotate(90deg);
	}

#contenido {
	background:url(../images/png/iso_servi.png) no-repeat bottom right;
}

/*==============================================================================
Estilos generales
==============================================================================*/
#main{
    margin-left:auto;
    margin-right:auto;
    width:90%;
}

.derecha{
    margin-top: 10px;
    right: 30px;
    float: right;
}

.izquierda{
    margin-top: 10px;
    float: left;
    margin-left: 15px;
}

.large_text {
    width: 400px;
}

.short_text {
    width: 100px;
}
.small_text{
    font-size: 13px;
}


/*==============================================================================
Estilos pagina de lista
==============================================================================*/
header{
    font-size: 32px;
    margin: 80px 30px 10px 0px;
    position: relative;
}

#divBuscador {
    min-width: 200px;
    margin: 0px 0px 0px 0px;
    min-height: 40px;
    padding: 13px;
}

.gris{
    background-color: #f2f2f2;
}

.redondeado{
    border: 1px solid #000000;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 15px;
}

.sombreado{
    -moz-box-shadow: 0px 0px 10px #000000;
    -webkit-box-shadow: 0px 0px 10px #000000;
    box-shadow: 0px 0px 10px #000000;
}

 #resultados{
        margin-top: 10px;
    }

.grilla {
	margin:0px;padding:0px;
	width:100%;
	box-shadow: 10px 10px 5px #888888;
	border:1px solid #3f7f00;
	
	-moz-border-radius-bottomleft:0px;
	-webkit-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
	
	-moz-border-radius-bottomright:0px;
	-webkit-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
	
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
	border-top-right-radius:0px;
	
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;
	border-top-left-radius:0px;
}.grilla table{
	width:100%;
	height:100%;
	margin:0px;padding:0px;
}.grilla tr:last-child td:last-child {
	-moz-border-radius-bottomright:0px;
	-webkit-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
}
.grilla table tr:first-child td:first-child {
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;
	border-top-left-radius:0px;
}
.grilla table tr:first-child td:last-child {
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
	border-top-right-radius:0px;
}.grilla tr:last-child td:first-child{
	-moz-border-radius-bottomleft:0px;
	-webkit-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
}.grilla tr:hover td{
	
}
.grilla tr:nth-child(odd){ background-color:#d4ffaa; }
.grilla tr:nth-child(even)    { background-color:#ffffff; }.grilla td{
	vertical-align:middle;
	
	
	border:1px solid #3f7f00;
	border-width:0px 1px 1px 0px;
	text-align:left;
	padding:7px;
	font-size:10px;
	font-family:Arial;
	font-weight:normal;
	color:#000000;
}.grilla tr:last-child td{
	border-width:0px 1px 0px 0px;
}.grilla tr td:last-child{
	border-width:0px 0px 1px 0px;
}.grilla tr:last-child td:last-child{
	border-width:0px 0px 0px 0px;
}
.grilla tr:first-child td{
		background:-o-linear-gradient(bottom, #b4e1a6 5%, #61a81a 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b4e1a6), color-stop(1, #61a81a) );
	background:-moz-linear-gradient( center top, #b4e1a6 5%, #61a81a 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#b4e1a6", endColorstr="#61a81a");	background: -o-linear-gradient(top,#b4e1a6,61a81a);

	background-color:#b4e1a6;
	border:0px solid #3f7f00;
	text-align:center;
	border-width:0px 0px 1px 1px;
	font-size:14px;
	font-family:Arial;
	font-weight:bold;
	color:#ffffff;
}
.grilla tr:first-child:hover td{
	background:-o-linear-gradient(bottom, #b4e1a6 5%, #61a81a 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b4e1a6), color-stop(1, #61a81a) );
	background:-moz-linear-gradient( center top, #b4e1a6 5%, #61a81a 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#b4e1a6", endColorstr="#61a81a");	background: -o-linear-gradient(top,#b4e1a6,61a81a);

	background-color:#b4e1a6;
}
.grilla tr:first-child td:first-child{
	border-width:0px 0px 1px 0px;
}
.grilla tr:first-child td:last-child{
	border-width:0px 0px 1px 1px;
}    

#general_error{
    background-color: #FEF1EC;
    color:red;
    max-width: 300px;
    border: 1px solid #D0D1D1;
    position: relative;
    margin: 0px auto;
    padding: 3px 10px;
    z-index: 999;
}

#selectFiltroOrdenGrilla{
    height: 27px;
    margin-top: 9px;
    width: 150px;
}

/* css for timepicker */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 45%; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right; }
.ui-timepicker-rtl dl dd { margin: 0 45% 10px 10px; }

#divPaginacion{
    margin-top: 4px;
}